﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/SiteHome.Master" Inherits="System.Web.Mvc.ViewPage<VCC.CMS.ViewModels.UserRegisterViewModel>" %>

<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
	Chợ rao vặt - Đăng ký thành viên | Cho102.vn
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="MetaContent" runat="server">

</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
    <link href="/Content/redmond/jquery-ui-1.8.6.custom.css" rel="stylesheet" type="text/css" />
    <script src="/Scripts/jquery.validate.min.js" type="text/javascript"></script>
    <script src="/Scripts/jquery-ui-1.8.6.custom.min.js" type="text/javascript"></script>
<div id="resumePost">
    <div id="aboutus">
        <div id="icon">Lợi ích khi bạn có tài khoản</div>
        <div id="article">
            <div style="width:100px;">
                <span id="scrollcontent" style="position: absolute;">
                    <marquee direction="left">
                        Chợ102.vn...Chúc bạn có một ngày thật vui vẻ!
                    </marquee>
                </span>
            </div>
            <div class="clear"></div>
        </div>
    </div>
    <ul class="progressBar">
        <li>Đăng ký thành viên</li>
        <li><strong>1</strong>Điền form thông tin bên dưới</li>
         <li><strong>2</strong>Kiểm tra email và xác nhận đăng ký</li>
    </ul>
    <br clear="all" />
    <div id="content_register">
        <div class="panelContainer">
            <h2><span>Thông Tin Đăng Ký Tài Khoản</span> </h2>
        </div>
        <div class="panelWrapper">
            <div class="panelContent">
                <%using (Html.BeginForm("Register", "User", FormMethod.Post, new { id = "adminForm", enctype = "multipart/form-data",onsubmit="return checkSubmit();" }))
                  {%>
                    <div class="blockContent">
                        <fieldset>
                        <dl class="formRow"><dt>&nbsp; </dt>  <dd class="formValue"><h3>Thông tin tài khoản</h3></dd> </dl>
                        <dl class="formRow"><dt><label for="resumeTitle">Tên đăng nhập</label></dt>
                          <dd class="formValue"><%=Html.TextBoxFor(m => m.User.UserName, new { style = "float:left", @class = "required", title = "Điền tên đăng nhập!", onchange = "CheckExistItem('userName');" })%>
                          <span id="applyusername" style="display:none"><img src="/Images/icon-24-reply.png" />Bạn có thể sử dụng tên đăng nhập này!</span>
                          
                          <input type="hidden" id="userNameAccept" value="0" />
                          <span id="canceapplyusername" style="display:none"><img src="/Images/icon-24-reply_x.gif" />Tên đăng nhập này đã tồn tại.Lưu ý tên đăng nhập không phân biệt viết hoa hay viết thường!</span>  
                          </dd> 
                        </dl>
                        <dl class="formRow"><dt><label for="resumeTitle">Địa chỉ email</label></dt>
                          <dd class="formValue"><%=Html.TextBoxFor(m => m.User.Email, new { style = "float:left", @class = "required email", title = "Điền địa chỉ email!", onchange = "CheckExistItem('email');" })%>
                          <span id="applyemail" style="display:none"><img src="/Images/icon-24-reply.png" />Bạn có thể sử dụng email này!</span>
                          <input type="hidden" id="emailAccept" value="0" />
                          <span id="canceapplyemail" style="display:none"><img src="/Images/icon-24-reply_x.gif" />Email đã tồn tại trong hệ thống!</span>  
                          </dd> 
                        </dl>
                        <dl class="formRow"><dt><label for="resumeTitle">Xác nhận email</label> </dt>  
                        <dd class="formValue"><%=Html.TextBox("ReEmail")%></dd> 
                        </dl>
                        <dl class="formRow"><dt><label for="resumeTitle">Mật khẩu</label> </dt>  
                        <dd class="formValue"><%=Html.PasswordFor(m => m.User.PassWord)%>
                        <span>&nbsp;4 đến 20 kí tự</span></dd> </dl>
                        <dl class="formRow"><dt><label for="resumeTitle">Xác nhận mật khẩu</label> </dt>  
                        <dd class="formValue"><%=Html.Password("RePassWord")%></dd></dl>
                    <hr class="horLineLight"/>
                        <dl class="formRow"><dt>&nbsp; </dt>  <dd class="formValue"><h3>Thông tin cá nhân</h3></dd> </dl>
                        <dl class="formRow"><dt><label for="resumeTitle">Họ tên</label> </dt>  
                        <dd class="formValue"><%=Html.TextBoxFor(m => m.User.DisplayName, new { @class = "required", title = "Nhập họ tên của bạn" })%></dd> </dl>
                        <dl class="formRow"><dt><label for="resumeTitle">Số điện thoại</label> </dt>  
                        <dd class="formValue"><%=Html.TextBoxFor(m => m.User.Phone, new {@class = "required number",title="Nhập số điện thoại" })%></dd> </dl>
                        <dl class="formRow"><dt><label for="resumeTitle">Ngày sinh</label> </dt>
                            <dd class="formValue"><%=Html.TextBox("bdtDay", null, new { @class = "datepicker",style="width:90px" })%> </dd> 
                        </dl>
                        <dl class="formRow"><dt><label for="resumeTitle">Địa chỉ</label> </dt>  
                        <dd class="formValue"><%=Html.TextBoxFor(m => m.User.Address, new { style="width:550px",title="Nhập địa chỉ"})%></dd> </dl>
                        <dl class="formRow"><dt><label for="resumeTitle">Giới tính</label> </dt>  
                        <dd class="formValue"><%=Html.RadioButtonFor(m => m.User.Sexual, true, new { @checked = "checked" })%>Nam <%=Html.RadioButtonFor(m => m.User.Sexual, false)%>Nữ</dd> 
                        </dl>
                        <dl class="formRow"><dt><label for="resumeTitle">Quốc gia</label> </dt>  
                        <dd class="formValue">
                            <%=Html.DropDownListFor(m => m.User.CountryID, new SelectList(Model.Countries, "ID", "Name", Int16.Parse(Session["CurCountryID"].ToString())).ToList(), "--Chọn quốc gia--", new { @class = "required", title = "Chọn tỉnh thành bạn đang cư trú", style = "width:130px" })%>
                            Tỉnh thành<%=Html.DropDownListFor(m => m.User.CityID, new SelectList(Model.Cities, "ID", "Name").ToList(), "--Chọn tỉnh thành--", new {@class = "required",title="Chọn tỉnh thành bạn đang cư trú", style = "width:130px" })%>
                            Quận/Huyện:<%=Html.DropDownListFor(m => m.User.DistrictID, new SelectList(Model.District, "ID", "Name").ToList(), "--Quận huyện--", new { style = "width:110px" })%>
                        </dd></dl>
                        <dl class="formRow"><dt><label for="resumeTitle">Ảnh đại diện:</label> </dt>  
                            <dd class="formValue"><input type="file" name="AdImage" id="AdImage" /></dd> 
                        </dl>
                        <dl class="formRow"><dt><label for="resumeTitle">Mã xác thực:</label> </dt>  
                            <dd class="formValue">
                                <%--<input type="text" name="captchacode" id="captchacode"/ style="width:70px;">--%>
                                <%= Html.TextBox("CaptchaText", string.Empty, new { @class = "required", style = "width: 70px;", title="Nhập mã an toàn"  })%>
                                <img id="captchaImg" name="captchaImg" src="/Applications/ShowCaptchaImage" style="vertical-align:middle;" class="pass" />
                                <img src="/images/icon-22-refresh.png" style="cursor:pointer;position:relative; vertical-align:middle"; class="changecaptcha" alt="Thay đổi captcha" title="Thay đổi captcha">    
                                <script type="text/javascript">
                                    $(".changecaptcha").live("click", function() {
                                        $("#captchaImg").attr("src", "");
                                        $("#captchaImg").attr("src", "/Applications/ShowCaptchaImage/?date=" + (new Date()));
                                        $("#CaptchaText").val("");
                                        return false;
                                    });
                                        </script>
                            </dd> 
                        </dl>
                            
                        <dl class="formRow"><dt>&nbsp;</dt>
                        <dd class="formValue"><input id="chkIAgree" type="checkbox" tabindex="13" value="1" name="chkIAgree"/>Tôi đã đọc và đồng ý với các <strong>
                            <a class="container" title="Qui định bảo mật" href="http://www.cho102.vn/Home/Regulations">Quy định bảo mật</a>và
                        <strong>
                            <a class="container" title="Thỏa thuận sử dụng" href="http://www.cho102.vn/Home/Postnews">Thỏa thuận sử dụng</a>
                        </strong>
                        </dd>
                        </dl>
                        </fieldset>
                    <hr class="horLineLight"/>
                        <div class="formActionSmall">
                            <fieldset>
                            <button class="actionBtn" tabindex="16" value="I agree" name="Submit" type="submit">
                            <span>Đăng ký</span>
                            </button>
                            </fieldset>
                        </div>
                    </div>
                <%}%>
            </div>
        </div>
    </div>
</div>
<div id="light" class="white_content">
    <div class="ProgressInfo">
        <div>
            <img style="padding-bottom: 8px;" src="/Images/Progress-clock.gif"/>
        </div>
        <div>
           <span class="highlightText">Thông tin thành viên đang được cập nhật lên hệ thống!</span>
        </div>
    </div>
</div>
<div id="fade" class="black_overlay"></div>  
<script type="text/javascript">
    $(document).ready(function() {
    $("#adminForm").validate();
        
        // Change country auto change city, district
    $("#User_CountryID").unbind("change").change(function() {
    var val = $("#User_CountryID").val();
        if (val == "" || val == '' || val == undefined)
            val = 0;
        // Change City
        AjaxChange("#User_CountryID", "#User_CityID", "/Applications/LoadCityByCountry/");
        // Change Distric
        $("#User_DistrictID").html("<option value=&#34;&#34;>--Quận/Huyện--</option>");
    });
        
       $("#User_CityID").unbind("change").change(function() {
        var val = $("#User_CityID").val();
            if (val == "" || val == '' || val == undefined)
                return false;
            AjaxChange("#User_CityID", "#User_DistrictID", "/Applications/LoadDistrictByCity/");
        });
    });
    //Check submit
    function checkSubmit() {
        var pas = $('#User_PassWord').val();
        var repas = $('#RePassWord').val();
        var email = $('#User_Email').val();
        var reemail = $('#ReEmail').val();
        var acusername = $('#userNameAccept').val();
        var acemail = $('#emailAccept').val();
        var Captchacode = $('#CaptchaText').val();
        var message ="";
        if (acusername != 1) message += "Tên đăng nhập không hợp lệ!";
        if (acemail != 1) message += "Email của bạn không hợp lệ hoặc đã được sử dụng!";
        if (pas != repas) message += "Xác nhận mật khẩu không đúng!";
        if (email != reemail) message += "Xác nhận email không đúng!";
        if (!$('#chkIAgree').attr('checked')) message += "Bạn chưa đồng ý với các quy định của chúng tôi!";
        if (message == '') {
            document.getElementById('light').style.display = 'block';
            document.getElementById('fade').style.display = 'block';
            return true;
        }
        else { alert(message); return false; }
        
    }
    // Check Exist User name and email
    function CheckExistItem(id) {
        var curentName = $("#User_UserName").val();
        var curentEmail = $('#User_Email').val();
        var curentItem = '';
        if (id == "userName") {
            curentItem = curentName;
            $('#applyusername').css('display', 'none'); $('#canceapplyusername').css('display', 'none');
            $('#userNameAccept').value = 0;
        }
        else {
            curentItem = curentEmail;
            $('#applyemail').css('display', 'none'); $('#canceapplyemail').css('display', 'none');
            $('#emailAccept').value = 0;
        }
        var ur = "/Applications/CheckExistItem/" + id;
        if (curentItem != '') {
            $.ajax({
                url: ur,
                type: 'POST',
                data: { itemName: curentItem },
                success: function(html) {
                    if (html.toString() == "true") {
                        if (id == "userName") {
                            $('#applyusername').css('display', 'block');
                            $('#userNameAccept').val(1);

                        }
                        else {
                            $('#applyemail').css('display', 'block');
                            $('#emailAccept').val(1);
                        }
                    }
                    else {
                        if (id == "userName") {
                            $('#canceapplyusername').css('display', 'block');
                            $('#userNameAccept').val(0);
                        }
                        else {
                            $('#canceapplyemail').css('display', 'block');
                            $('#emailAccept').val(0);
                        }
                    }
                },
                error: function(mes) {
                    return false;
                }
            });
        } 
    }

    $.datepicker.setDefaults($.datepicker.regional['vi']);
    $(".datepicker").datepicker({
        dateFormat: "dd/mm/yy",
        changeMonth: true,
        yearRange: "1920",
        showOn: "button",
        buttonImage: "/Images/calendar.gif",
        buttonImageOnly: true,
        changeYear: true
    });
</script>
</asp:Content>



<asp:Content ID="Content4" ContentPlaceHolderID="LeftContent" runat="server">
</asp:Content>

<asp:Content ID="Content5" ContentPlaceHolderID="DiaDanh" runat="server">
</asp:Content>
